<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>02.新浪小结构</title>
</head>
<style>
    * {
        margin: 0;
        padding: 0;
    }
    
    ul {
        list-style: none;
    }
    
    img {
        display: block;
    }
    
    a {
        text-decoration: none;
        color: #666666;
    }
    
    h1 h2 h3 h4 h5 h6 {
        font-size: 16px;
        font-weight: normal;
    }
    
    #main {
        margin: 20px auto;
        width: 238px;
        border: 1px solid #d9e0ee;
        border-top: 3px solid #ff8400;
    }
    
    #main h3 {
        height: 35px;
        border-bottom: 1px solid #d9e0ee;
        line-height: 35px;
        color: black;
        padding-left: 11px;
    }
    
    #main h3 a {
        color: black;
    }
    
    #main h3 a:hover {
        color: #ff8400;
    }
    
    #main div img {
        margin: 8px auto 3px auto;
    }
    
    #main ul {
        font-size: 12px;
        line-height: 24px;
        margin-bottom: 8px;
    }
    
    #main ul li {
        padding-left: 10px;
        line-height: 24px;
        height: 24px;
        overflow: hidden;
        font-size: 12px;
        background: url(./img/icon.png) no-repeat 0 -881px;
    }
    
    #main ul li.first-line {
        border-bottom: 1px solid #d9e0ee;
        padding-bottom: 3px;
        margin-bottom: 8px;
    }
    
    #main ul a {}
    
    #main ul a:hover,
    #main ul a:active {
        color: #ff8400;
        text-decoration: underline;
    }
    /* .list-b li {
        padding-left: 10px;
        line-height: 24px;
        height: 24px;
        overflow: hidden;
        font-size: 12px;
        background: url(./img/icon.png) no-repeat 0 -881px;
    }
    
    .list-b a:link {
        color: #666;
        text-decoration: none;
    }
    
    .list-b a:visited {
        color: #666;
        text-decoration: none;
    }
    
    .list-b a:hover,
    .list-b a:active {
        color: #ff8400;
        text-decoration: underline;
    } */
</style>

<body>
    <div id="main">
        <div>
            <h3>
                <a href="http://tech.sina.com.cn/d/photo/">探索趣图</a>
            </h3>
        </div>

        <div>
            <a href="http://gif.sina.com.cn/">
                <img src="./img/f83f-fe2efd32ff9802b28fb528bb3e74fd8f.gif" alt="" width="218" height="160">
            </a>
        </div>
        <div style="padding:8px 0 8px 8px;">
            <ul class="list-b">
                <li class="first-line">
                    <a href="https://gif.sina.com.cn/">GIF：到底哪里惹到你了</a>
                </li>
                <li>
                    <a href="https://finance.sina.com.cn/tech/2021-11-01/doc-iktzscyy2949939.shtml">我国首次实现从一氧化碳到蛋白质的合成</a>
                </li>
                <li>
                    <a href="https://finance.sina.com.cn/tech/2021-11-01/doc-iktzscyy2943578.shtml">科学家发现带有扭曲吸积盘的黑洞</a>
                </li>
            </ul>
        </div>
    </div>
</body>

</html>